/**
*@description 垂直折线图（Line）
*@author yhw
*/
import React, { Component, PropTypes } from 'react';
// import { connect } from 'react-redux';
import ReactEcharts from 'echarts-for-react';
import styles from './TimeList.less';
import {Menu, Icon,Tooltip} from 'antd';

// var screen;

class TimeList extends React.Component{
  constructor(props){
        super(props);
        // this.state={
        //     h:''
        // }
      }
  componentDidMount(){
    // var height = document.getElementById('root').offsetHeight - 202;
    // this.setState({
    //   h:Math.max(document.body.offsetHeight-202,420) || height
    // })
  }
  render(){
    var state = this.state;
    return (
      <div className={styles.container}>

      <p className={styles.tits}>
        {location.hash.indexOf('MemberLevel')>0?"总会员数":"总用户数"}&nbsp;
        <Tooltip placement="right" title={location.hash.indexOf('MemberLevel')>0?(<span>总会员数是指截止到昨日，有过线下购买行为并且入会的唯一会员总数（包括交易信息缺失的老会员）<br />每天的会员数是指截止到前一日的会员总数。</span>):(<span>总用户数是指截止到昨日的有过线下购买或者关注过品牌微信官方账号的唯一用户数<br />并除去交易信息缺失的用户；每天的用户数是指截止到前一日的用户总数</span>)}>
          <Icon type="question-circle-o" className={styles.anticon}/>
        </Tooltip>
      </p>
      <h3 className={styles.htit}>{parseInt(this.props.count).formatMoney()}</h3>

      <ul className={styles.timeList} style={{height:541+"px"}}>
        {this.props.data.map(function(item){
              return (<li className={styles.timeLi} key={item.time.replace(/\//img,'')}>
          <span className={styles.timeSpan}>{item.time}</span>
          <div className={styles.timeYou}>
            <p className={styles.timeNum}>
              <i className={item.incrCount>=0?styles.up:styles.down}></i>
              <span className={styles.shu}>{parseInt(item.userCount).formatMoney()}</span>
            </p>
            <span className={item.incrCount>=0?styles.zeng:styles.jian}>{item.incrCount>=0?"+":""}{parseInt(item.incrCount).formatMoney()}</span>
          </div>
          <i className={styles.timeCycle}></i>
        </li>)
        })}
      </ul>

      </div>
    );
  }
};

TimeList.propTypes = {
  count: PropTypes.string,
  data: PropTypes.array//.isRequired
};

export default TimeList;
